<template>
  <a-row class='userLayout' type="flex" justify="center" align="middle">
    <a-col :xl='12' :lg='20' :md='20' :sm='24' :xs='24'>
      <router-view />
    </a-col>

    <a-row :span='24'>

    </a-row>
  </a-row>
</template>

<script>
import { deviceMixin } from '@/store/device-mixin'
import SelectLang from '@/components/SelectLang'
import { mapGetters } from 'vuex'

export default {
  name: 'UserLayout',
  components: {
    SelectLang
  },
  mixins: [deviceMixin],
  computed:{
    ...mapGetters([
      'config',
    ]),
  },
  mounted () {
    document.body.classList.add('userLayout')
  },
  beforeDestroy () {
    document.body.classList.remove('userLayout')
  }
}
</script>

<style lang="less" scoped>
.userLayout {
  width: 100%;
  min-height: 100%;
  background: #f0f2f5 url(~@/assets/login/background.svg) no-repeat 50%;
  background-size: 100%;
  position: relative;
}
</style>
